<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=1">
    <title>KIPS | kipkips official website</title>
    <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@500&family=Poppins:wght@500&display=swap" rel="stylesheet">
    <link rel="icon" href="./img/icon.ico">
    <script async="" src="https://www.google-analytics.com/analytics.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/tween.js/16.3.5/Tween.min.js"></script>
    <script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
    <link charset="UTF-8" href="./css/common/common.css" rel="stylesheet">
    <script src="js/three/three.min.js"></script>
    <script src="js/loader/obj.loader.js"></script>
    <script src="js/loader/mtl.loader.js"></script>
    <script src="js/loader/fpx.loader.js"></script>
    <script src="js/utils/utils.js"></script>
    <script src="index.js"></script>
    <style>
        * {
            overflow: hidden;
        }
        
        #view,
        #matter {
            width: 100%;
            height: 100%;
            position: fixed;
            z-index: 1;
            top: 0;
            overflow: hidden;
        }
        
        #view {
            opacity: 0.0;
            z-index: 2;
        }
        
        div canvas {
            width: 100%;
            height: 100%;
        }
        
        #menu {
            padding: 4vmin 4.4vmin;
            position: relative;
            top: 0;
            z-index: 100;
            height: 100%;
            pointer-events: none;
        }
        
        #menu p a {
            pointer-events: auto;
        }
        
        #menu h1 {
            /* font-weight: 400; */
            font-size: calc(1.8rem + 3.6vmin);
            margin-bottom: 1vh;
            letter-spacing: calc(.4rem + 1vmin);
        }
        
        #menu h2 {
            font-weight: 400;
            font-size: calc(.7rem + .9vmin);
            margin-bottom: 6vh;
            letter-spacing: .22rem;
        }
        
        #menu p {
            margin-bottom: 4vh;
            font-size: calc(.5rem + 3.6vmin);
        }
    </style>
</head>

<body id="kips">
    <div id="view" style="opacity: 0.5;">
        </canvas>
    </div>
    <div id="menu" style="display: block;">
        <h1>KIPS</h1>
        <h2>kipkips official website</h2>
        <p><a href="./news/">NEWS</a></p>
        <p><a href="./contents/">CONTENTS</a></p>
        <p><a href="./sounds/">SOUND</a></p>
        <p><a href="./about/">ABOUT</a></p>
        <p class="spa"><a href="https://www.youtube.com/channel/UCLRIiA3trYeIwuf6smFgweA?view_as=subscriber" target="_blank">YOU TUBE</a></p>
        <p><a href="https://twitter.com/RECNEPS_KIPS" target="_blank">TWITTER</a></p>
        <p class="spa"><a href="https://github.com/KIPKIPS" target="_blank">GITHUB</a></p>
    </div>
    <div id="loading" style="display: none;">
        <p></p>
    </div>
    <canvas id="canvas">Please use a browser that support canvas.</canvas>
</body>

</html>